<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <link rel="stylesheet" type="text/css" href="/node_modules/bootstrap/dist/css/bootstrap.min.css" />
  <style>
    #form {
      width: 400px;
      margin: 0 auto;
      margin-top: 100px;
    }

    h1 {
      text-align: center;
    }

    input[type='submit'] {
      width: 100%;
    }
  </style>
</head>

<body>
  <form id="form">
    <h1>登录页面</h1>
    <div class="form-group">
      <input type="text" name="username" id="username" class="form-control input-lg" placeholder="用户名" required value="ls">
    </div>

    <div class="form-group">
      <input type="password" name="password" id="password" class="form-control input-lg" placeholder="密码" required value="123">
    </div>

    <div class="form-group">
      <a href="/register" class="pull-right">去注册</a>
    </div>

    <div class="form-group">
      <input type="submit" value="登录" class="btn btn-primary btn-lg">
    </div>
  </form>

  <script src="/node_modules/jquery/dist/jquery.min.js"></script>
</body>

<!-- 登录功能 -->
<script>
    $(function(){
       // 先清空
       $('[name=username]').val('');
       $('[name=password]').val('');

       $('#form').on('submit', function(e){
         //  console.log('a');
 
         //  阻止默认跳转
         e.preventDefault(); 
 
         //  登录请求
         $.ajax({
           type: 'post',
           url: '/user/addLogin',
           data: $("#form").serialize(),
           dataType: 'json',
           success: function(result) {
              // console.log(result);
              if(result.status == 200) {
                location.href = '/'
                // location.href = 'http://127.0.0.1:3001'
              }
           }
         })
       })
    })
</script>

</html>